{% extends "todo/base.html" %}

{% block content %}
    <div class="row justify-content-center mt-5">
        <div class="col-md-10">
            {% if todos %}
                 <h1>{{ todos.count }} Current Todo{{ todos.count|pluralize }}</h1>
            {% else %}
                           <h1>Current Todos</h1>
            {% endif %}
        </div>
    </div>
    <div class="row justify-content-center mt-5">
        <div class="col-md-10">
        {% if todos %}
            <div class="list-group">
                {% for todo in todos %}
                    <a href="{% url 'viewtodo' todo.id %}" class="list-group-item list-group-item-action{% if todo.important %} list-group-item-danger{% endif %}"><b>{{ todo.title }}</b>{% if todo.memo %} - {{ todo.memo|truncatechars:30 }}{% endif %}</a>
                {% endfor %}
            </div>
        {% else %}
            <div class="text-center">
                <h2>Looks like you don't have any todos! Nice work.</h2>
            <br>
            <a role="button" class="btn btn-primary" href="{% url 'createtodo' %}">New Todo</a>
            </div>
        {% endif %}
        </div>
    </div>
{% endblock %}
